<template>
    <!-- <div>layout</div> -->
    <router-view />
    <!-- 底部导航栏 -->
    <van-tabbar v-model="active" class="tabbar" route>
        <van-tabbar-item v-for="item in router.options.routes[0].children" :key="item.path" :icon="item.meta.icon"
            :to="`/${item.path}`">{{ item.meta.name }}
        </van-tabbar-item>
    </van-tabbar>
</template>

<script setup name="Main">
import { ref } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const active = ref(0)
</script>

<style scoped>
.tabbar {
    background-color: #f5f5f5;
}

.van-tabbar-item--active {
    background-color: #f5f5f5;
}
</style>